<template>
  <div id="sds">
    <div class="big">
        <header>
           <p @click='home'><img src=".././assets/img/left@2x.png"></p>
           <p>{{title}}</p>
           <p></p>
        </header>
        <div class="kuang">
            <p>ETC卡号</p>
            <input type="text" placeholder="输入37开头的20位卡号">
        </div>
        <div class="end">
            <a href="#">下一步</a>
        </div>
    </div>
  
   </div>
</template>

<script>
export default {
  name: 'ETCkahao',
  data () {
    return {
      active: 'ETCkahao',
      title: '用户中心'
    }
  },
  methods:{
    home:function(){
        this.$router.go(-1)
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang='less'>
@import '../assets/less/style.less';
.big{
     width: 100%;
    height:100%;
    header {
    .px2rem(height,88);
      background: #21d094;
      display: flex;
      align-items: center;
      justify-content: space-between;
      /* .border(1,solid,#000); */
      p:nth-child(1) {
        flex: 1;
        .font(30,#fff);
        .padding-left(35);
        img {
          .px2rem(height,39);
          .px2rem(width,39);
        }
      }
      p:nth-child(2) {
        flex: 2;
        text-align: center;
        .font(30,#fff);
      }
      p:nth-child(3) {
        flex: 1;
        .font(30,#fff);
      }
  }
    .kuang{
        display: flex;
        .margin-top(46);
        p{
            font-size: 15px;
            font-family:"微软雅黑";
            .margin-left(36);
            .margin-right(14);
            .margin-top(24);
        }
        input{
            .px2rem(width,510); 
            .px2rem(height,76);
            font-size: 14px;
            font-family:"微软雅黑";
            .padding-left(20);
             outline:none;
             border-top:1px solid #ccc;
             border-left:1px solid #ccc;
        }
    }
    .end{
            .margin-top(112);
            a{
                display: block;
                .px2rem(width,392); 
                .px2rem(height,55);
                background: #b2b2b2;
                .margin-left(31);
                color: white;
                font-family: "微软雅黑";
                .px2rem(font-size,30);
                .padding-top(23);
               .padding-left(299);
            }
    }
}

</style>
